<template>
	<view class="my">

		<view class="user">
			<view v-if="status=='false'" class="user-message" @click="goPersonal">
				<uni-icons type="contact" size="60"></uni-icons>

				<text>登录参与花友互动</text>

			</view>
			<view v-else="status=='true'" class="user-message" @click="goPersonal">

				<image src="../../static/logo.png" mode=""></image>
				<text>用户xxxxx</text>

			</view>
			<uni-icons type="gear-filled" size="30"></uni-icons>

		</view>
		<view class="message">
			<view @click="praise">
				<text>0</text>
				<text>获赞</text>
			</view>
			<view @click="attention">
				<text>0</text>
				<text>关注</text>
			</view>
			<view @click="fans">
				<text>0</text>
				<text>粉丝</text>
			</view>
			<view @click="inform">
				<text>0</text>
				<text>通知</text>
			</view>
		</view>
		<view class="function">
			<view @click="collect" class="func">
				<view style="background-color: #7bbdff; border-radius: 30rpx;">
					<image src="@/static/icons/collect.png" ></image>
				</view>
				<view>收藏</view>
			</view>
			<view @click="history" class="func">
				<view style="background-color: #ffd954; border-radius: 30rpx;">
					<image src="@/static/icons/history.png" ></image>
				</view>
				<view>历史</view>
			</view>
			<view @click="release" class="func">
				<view style="background-color: #fe727f; border-radius: 30rpx;">
					<image src="@/static/icons/release.png" ></image>
				</view>
				
				<view>我发布的</view>
			</view>
			
		</view>
		<button @click="exit">退出登录</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				status: 'false',
				list: [

				]

			}
		},
		methods: {
			exit() {
				http({
					method: 'post',
					url: `/user/logout`,
					data: {},
					success: (res) => {
						console.log(res.data)
						uni.showModal({
								title: '提示',
								content: '退出登录成功'
							}),
							uni.reLaunch({
								url: '/pages/community/community'
							});

					}
				})
			},
			praise() {
				uni.navigateTo({
					url: '/pages/mine/message/praisemessage'
				})
			},
			goPersonal() {
				uni.navigateTo({
					url: '/pages/mine/personaldata/personaldata'
				})
			},
			attention() {
				uni.navigateTo({
					url: '/pages/mine/message/attention'
				})
			},
			fans() {
				uni.navigateTo({
					url: '/pages/mine/message/fans'
				})
			},
			inform() {
				uni.navigateTo({
					url: '/pages/mine/message/informmessage'
				})
			},
			collect() {
				uni.navigateTo({
					url: 'function/collect'
				})
			},
			history() {
				uni.navigateTo({
					url: '/pages/mine/function/history'
				})
			},
			release() {
				uni.navigateTo({
					url: '/pages/community/tiezi'
				})
			}

		}
	}
</script>

<style>
	.my {}

	.nav {

		margin-top: 20rpx;
		height: 140rpx;
		width: 750rpx;
		display: flex;
		align-items: center;
	}

	.user {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-right: 10rpx;

	}

	.user-message {
		display: flex;
		align-items: center;
		padding-left: 20rpx;
	}
	.user-message image {
		
		height: 80rpx;
		width: 80rpx;
	}

	.message {

		display: flex;
		justify-content: space-around;
		padding-top: 20rpx;
	}

	.message view {
		display: flex;
		align-items: center;
		flex-direction: column;

	}

	.message text {
		font-size: 28rpx;
		font-weight: bold;

	}

	.function {
		margin: 30rpx;
		width: 690rpx;
		height: 150rpx;
		box-shadow: 0 0 0 2px #eee;
		border-radius: 20px;
		display: flex;
		justify-content: space-around;
	}

	.func {
		display: flex;
		flex-direction: column;
		justify-content: center;

	}
	.func>view:nth-child(1){
		padding: 10rpx;
	}
	.func>view:nth-child(2){
		font-size: 24rpx;
	}
	.func>view {
		bottom: 0;
		color: #666;
		text-align: center;

	}

	.function image {
		height: 80rpx;
		width: 80rpx;
	}
</style>
